<template>
    <div style="margin-left: 20px;width: 90vw">
        <div class="selstocked">
            <el-table
                    :data="stos"
                    stripe
                    style="width: 100%">
                <el-table-column
                        prop="id"
                        label="编号">
                </el-table-column>
                <el-table-column
                        prop="man.name"
                        label="处理人">
                </el-table-column>
                <el-table-column
                        prop="commodityname"
                        label="商品名称">
                </el-table-column>
                <el-table-column
                        prop="stock"
                        label="数量">
                </el-table-column>
                <el-table-column
                        prop="newtime"
                        label="处理时间"
                        width="100px">
                    <template slot-scope="scope">
                        {{scope.row.newtime | formatDate}}
                    </template>
                </el-table-column>
                <el-table-column
                        prop="joinprice"
                        label="商品进价">
                </el-table-column>
                <el-table-column
                        prop="price"
                        label="商品售价">
                </el-table-column>
                <el-table-column
                        prop="joinstocked"
                        label="是否入库上架"
                        width="110px">
                    <template slot-scope="scope">
                        <el-select disabled v-model="scope.row.joinstocked">
                            <el-option v-for="s in sf"
                                       :key="s"
                                       :label="s.name"
                                       :value="s.va">
                            </el-option>
                        </el-select>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="because"
                        label="下架原因">
                </el-table-column>
                <el-table-column
                        fixed="right"
                        label="操作">
                    <template slot-scope="scope">
                        <el-button @click="updStateds(scope.row)" type="text">确认入库上架</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <div class="block">
                <el-pagination
                        @current-change="toPage"
                        layout="prev, pager, next"
                        :total="currentPageCount"
                        :current-page="currentPageNo"
                        :page-size="6">
                </el-pagination>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "SelStocked",
        data() {
            return {
                stos: [{
                    id: '1',
                    man: {
                        id: '1',
                        name: '2233'
                    },
                    commodityname: '2233',
                    stock: '23',
                    newtime: '2019-04-22',
                    joinprice: '23',
                    price: '223',
                    joinstocked: '1',
                    because: ''
                }],
                sf: [{name: '否', va: 0}, {name: '是', va: 1}],
                //当前的页码
                currentPageNo: 1,
                //最大页码
                currentPageCount: 1
            }
        },
        filters: {
            formatDate: function (value) {
                let date = new Date(value);
                let y = date.getFullYear();
                let MM = date.getMonth() + 1;
                MM = MM < 10 ? ('0' + MM) : MM;
                let d = date.getDate();
                d = d < 10 ? ('0' + d) : d;
                let h = date.getHours();
                h = h < 10 ? ('0' + h) : h;
                let m = date.getMinutes();
                m = m < 10 ? ('0' + m) : m;
                let s = date.getSeconds();
                s = s < 10 ? ('0' + s) : s;
                return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
            }
        },
        beforeRouteEnter(to, from, next) {
            next(vm => {
                //在此处vm表示vue组件对象
                vm.loadDataS();
            });

        },
        methods: {
            toPage: function (num) {
                this.currentPageNo = num;
                this.loadDataS();

            },
            loadDataS: function () {
                this.axios.get("/selectAllStocked", {
                    params: {
                        pageNo: this.currentPageNo, pageSize: 6, storeid: 1
                    }
                })
                    .then((response) => {
                        this.stos = response.data.data;
                        this.currentPageCount = response.data.pageCount;
                    })
            },
            updStateds: function (row) {
                var d1 = 0;
                var d2 = 0;
                if (row.joinstocked == 0) {
                    var s = {
                        id: row.id,
                        joinstocked: 1,
                        stock: '0',
                        because: '',
                        storeid: 1
                    }
                    this.axios.post("/updStock", s)
                        .then((response) => {
                            d1 = response.data;
                        })

                    this.axios.get("/updComStocked", {
                        params: {
                            name: row.commodityname,
                            stock: row.stock,
                            state:'1',
                            storeid: 1
                        }
                    })
                        .then((response) => {
                            d2 = response.data;
                        })

                    setTimeout(() => {
                        if (d1 == 1 && d2 == 1) {
                            this.$message({
                                message: '更新成功',
                                type: 'success'
                            });
                        } else {
                            this.$message.error('更新失败');
                        }
                    }, 2000);
                } else {
                    this.$message({
                        message: '商品已入库',
                        type: 'warning'
                    });
                }

                this.loadDataS();
            }
        }
    }
</script>

<style scoped>
    .selstocked {
        margin: 50px 50px 50px 50px;
    }
</style>